<template>
	<view class="page-body ">
		<scroll-view class="list-scroll-content" scroll-y @scrolltolower="loadData">
			<!-- 空白页 -->
			<empty v-if="itemList.loaded === true && itemList.list.length === 0"></empty>
			<!-- 列表 -->
			<view v-for="(item,index) in itemList.list" :key="index" class="item mb20 p20 bg-white" @click="app.goPage('info?log_id='+item.log_id)">
				<view class="title left-yuan">{{item.report_type}} <view  class="fr">{{item.status}}<u-icon class="ml10" name="arrow-right" size="26"></u-icon></view></view>
				<view class="report_user mt10">被举报人：{{item.report_real_name}}</view>
				<view class="description mt10">{{item.description}}</view>
			</view>
			<uni-load-more :status="loadingType"></uni-load-more>
		</scroll-view>
	</view>
</template>

<script>
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
	import empty from "@/components/empty";
	export default {
		components: {
			uniLoadMore,
			empty
		},
		data() {
			return {
				itemList: {
					list:[]
				},
				loadingType: 'more',
				param: {
					p: 0
				},
			}
		},
		onLoad() {
			this.loadData();
		},
		onShow() {
		},
		onReady() {},
		methods: {
			loadData(source) {
				if (this.loadingType == 'nomore') {
					return;
				}
				this.param.p++;
				this.loadingType = 'loading';
				this.$u.post('channel/api.report/getList', this.param).then(res => {
					this.itemList.list = this.itemList.list.concat(res.data.list);
					//loaded新字段用于表示数据加载完毕，如果为空可以显示空白页
					this.$set(this.itemList, 'loaded', true);
					//判断是否还有下一页，有是more  没有是nomore
					this.loadingType = this.param.p == res.data.page_count ? 'nomore' : 'more';
				})
			}
		}
	}
</script>

<style lang="scss">
	.list-scroll-content {
		position: relative;
		height: 100%;
		.item{
			.title{
				font-size: 30rpx;
			}
			.description{
				color: $font-color-light;
			}
		}
	}
</style>
